<template>
  <view class="forget-bg">
    <view class="forget-card">
      <view class="forget-input forget-margin-b">
        <input type="text" placeholder="用户名" v-model="form.username" />
      </view>
      <view class="forget-input forget-margin-b">
        <input type="text" placeholder="密码" v-model="form.password" />
      </view>
      <view class="forget-input forget-margin-b">
        <input type="text" placeholder="昵称" v-model="form.nickname" />
      </view>
      <view class="forget-input forget-margin-b">
        <input type="number" placeholder="手机号" v-model="form.mobile" />
      </view>
      <view class="forget-input forget-margin-b">
        <input type="text" placeholder="Email" v-model="form.email" />
      </view>
    </view>
    <view class="forget-btn">
      <button class="landing" type="primary" @click="submit"> 添加 </button>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      form: {
        username: "",
        password: "",
        nickname: "",
        mobile: "",
        email: ""
      }
    }
  },
  methods: {
    submit() {
      console.log("--------------执行添加操作--------------");
      uniCloud.callFunction({
        name: 'addUser', // 云函数名称
        data: this.form,
        success: (e) => {
          console.log(e.result); // 打印返回数据
          uni.showToast({
            title: '添加成功',
            duration: 2000
          });
          uni.navigateTo({
            url: "../index/index"
          })
        },
      })
    }
  }
}
</script>
<style>
	.landing {
		height: 84upx;
		line-height: 84upx;
		border-radius: 44upx;
		font-size: 32upx;
		background: linear-gradient(left, #FF978D, #FFBB69);
	}

	.forget-btn {
		padding: 10upx 20upx;
		margin-top: 580upx;
	}

	.forget-input input {
		background: #F2F5F6;
		font-size: 28upx;
		padding: 10upx 25upx;
		height: 62upx;
		line-height: 62upx;
		border-radius: 8upx;
	}

	.forget-margin-b {
		margin-bottom: 25upx;
	}

	.forget-input {
		padding: 10upx 20upx;
		overflow: auto;
	}

	.forget-card {
		background: #fff;
		border-radius: 12upx;
		padding: 60upx 25upx;
		box-shadow: 0 6upx 18upx rgba(0, 0, 0, 0.12);
		position: relative;
		margin-top: 120upx;
	}

	.forget-bg {
		height: 260upx;
		padding: 25upx;
		background: linear-gradient(#FF978D, #FFBB69);
	}
</style>
